<template>
  <div class="consensus-activity-fomo">
    <c-title text="Fomo加权分红"></c-title>
    <div class="box" v-for="item in list" :key="item.id">
      <p class="title">{{item.has_one_activity.activity_name}}【{{item.has_one_activity.activity_sn}}】</p>
      <div class="around">
        <div class="column">
          <span class="c-6E6E79">个人参与额</span><span class="bold">{{item.yuan_value}}</span>
        </div>
        <div class="column">
          <span class="c-6E6E79">当期总额</span><span class="bold">{{item.current_issue_total}}</span>
        </div>
        <div class="column">
          <span class="c-6E6E79">奖励数量</span><span class="bold">{{item.reward_value}}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { scrollMixin } from "../../utils/mixin";
export default {
  mixins: [scrollMixin],
  data() {
    return {
      list: [],
      total_page: 1,
      isLoadMore: true,
      page: 1,
    };
  },
  activated() {
    this.getData();
  },
  methods: {

    getMoreData() {
      this.isLoadMore = false;
      if (this.page >= this.total_page) {
        return;
      }
      let page = this.page + 1;
      this.getData(page);
    },
    getData(page=1) {
      $http.get("plugin.wise-yuan-trade.frontend.my.fomo-weighted-dividend-log", {page}, "").then(res => {
      this.isLoadMore = true;
        if (res.result) {
          let data = res.data;
          (page==1)?(this.list=data.data):(this.list=this.list.concat(data.data));
          this.count=data.count;
          this.total_page = data.last_page;
          this.page = data.current_page;
        } else {
          this.$toast(res.msg);
        }
      })
    }

  }
};
</script>

<style scoped lang="scss">
.consensus-activity-fomo {
  padding: 0.625rem 0.75rem;

  .around {
    display: flex;
    align-items: center;
    justify-content: space-around;
  }

  .bold {
    font-weight: bold;
  }

  .c-6E6E79 {
    color: #6e6e79;
  }

  .column {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .title {
    font-size: 0.875rem;
    font-weight: bold;
    color: #00001c;
    text-align: left;
    margin-bottom: 0.9063rem;
  }

  .box {
    background: #fff;
    border-radius: 0.625rem;
    padding: 0.9375rem 0.625rem;
  }
}
</style>
